@charset "utf-8";
/* CSS Document */

*{ margin:0px; padding:0px;}
body{ font-size:14px;}
a{ color:#333; font-family:"微软雅黑"; text-decoration: none;}
ul{list-style-type:none;}
.ysj{width:1200px; margin:0 auto;}
.fl{float:left;}
.fr{float:right;}
.qing{ clear: both;}

/*产品中心*/
.df_cp{ margin:50px auto 50px; overflow:hidden; padding-top:0px;}
.df_cp .cp_fl{ width:530px; height:350px;}
.cp_fl .tit{ width:100%; text-align:center; height:50px; color:#FFF; background:#008cd6; font-size:20px; font-weight: bold; line-height:50px;}
.cp_fl a{ width:170px; height:140px; background:#008cd6; display:block; float:left; margin:10px 10px 0 0; text-align:center; padding:20px 0; box-sizing:border-box; color:#FFF; transition:all ease 0.5s;}
.cp_fl a img{ width: auto; height:70px;}
.cp_fl a:hover{ background:#d72533;}
.cp_fl a p{ margin-top:10px; font-weight:bold;}
.cp_fl a:nth-child(3n){ margin-right:0;}
.df_cp .cp_jj{ width:650px; height:350px; position:relative; overflow:hidden;}
.cp_jj .tu img{width:100%; height:100%; transition:all ease 0.5s;}
.cp_jj:hover .tu img{transform: scale(1.1);}
.cp_jj .zi{ width:220px; height:350px; position:absolute; top:0; box-sizing:border-box; padding:35px; background:rgb(2 73 152 / 95%); color:#FFF; font-size:16px; line-height:32px; text-align:justify;}
.cp_jj .zi .gd{ width:100%; display:block; height:35px; line-height:35px; text-align:center; border:solid 1px #FFF; color:#FFF; margin-top:35px; font-size:14px;}
.df_cp .cp_nr{ width:1200px; height: auto;margin-top:30px;}
.df_cp .cp_nr li{ width:24%; line-height:0; border:solid 1px #EEE; float:left; box-sizing:border-box; margin-right:1.33333333%; margin-top:20px; position:relative; overflow:hidden;}
.df_cp .cp_nr li:nth-child(4n){ margin-right:0;}
.df_cp .cp_nr li img{ width:100%; height:215px;}
.df_cp .cp_nr li p{ width:100%; background:#fafafa; height:45px; line-height:45px; color:#666;text-align:center; font-size:16px; position:absolute; transition:all ease 0.3s; bottom:0; opacity:1; }
.df_cp .cp_nr li:hover p{ height:0;opacity:0;}
.df_cp .cp_nr li a{ width:100%; height:100%; padding-top:100px; font-size:16px; box-sizing:border-box; position:absolute; top:0; left:0; text-align:center; background:rgb(0 0 0 / 50%); color:#FFF; opacity:0; transition:all ease 0.5s;}
.df_cp .cp_nr li a h5{ width:100px; margin: 0 auto; margin-top:30px; height:30px; line-height:30px; border:1px solid #FFF;}
.df_cp .cp_nr li:hover a{ opacity:1; }

/*公司简介*/
.df_jj{ width:100%; height:650px; background:url(../images/bj-1.jpg) no-repeat top center;}
.df_jj .tit{ text-align:right; color:#FFF; padding-top:50px; overflow:hidden;}
.df_jj .tit h5{ margin:15px 0 25px;}
.df_jj .tit p{ width:100px; height:2px; background:#FFF; float:right;}
.df_jj .jj_nr{ margin-top:50px; background:#FFF; overflow:hidden;}
.df_jj .jj_nr .tu{ width:380px; height:440px;}
.df_jj .jj_nr .tu img{ width:100%; height:100%;}
.df_jj .jj_nr .zi{ width:820px; height:440px; box-sizing:border-box; padding: 50px 30px;}
.df_jj .jj_nr .zi h1{ font-size:24px; color:#004898; margin:0 0 20px;}
.df_jj .jj_nr .zi p { font-size:14px; text-align:justify; text-indent:2em; color:#333; line-height:30px;}
.df_jj .jj_nr .zi .gd{ width:160px; height:40px; line-height:40px; border:1px solid #EEE; display:block; text-align:center; margin:30px 0 0;}
.df_jj .jj_nr .zi a:hover { color:#004898; border:1px solid #004898;}
.df_jj .zzry{ margin:30px 0 0; overflow:hidden;}
.df_jj .zzry li{ width:200px; height:290px; float:left; margin-right:50px; text-align:center; box-sizing:border-box; border:1px solid #EEE; padding:10px; transition:all ease 0.5s;}
.df_jj .zzry li:hover{ border:1px solid #004898; }
.df_jj .zzry li:hover a{ color:#004898;}
.df_jj .zzry li:nth-child(5){ margin-right:0;}
.df_jj .zzry li img{ width:100%;}
.df_jj .ys{ height:130px; background:#f5f5f5; margin:30px 0;}
.df_jj .ys li{ width:400px; height:130px; float:left; border-right:1px solid #FFF; box-sizing:border-box;}
.df_jj .ys li:nth-child(3){ border:none;}
.df_jj .ys li .fl{ height:70px; width:160px; margin:30px 0; text-align:center; border-right:solid #CCCCCC 1px; box-sizing:border-box;}
.df_jj .ys li .fl img{ height:100%;}
.df_jj .ys li .fr { width:180px; height:80px; margin:25px 29px; width:180px;height:80px;cursor:pointer;}
/*.df_jj .ys li .fr:hover{animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;transform: translate3d(0, 0, 0); backface-visibility: hidden; perspective: 1000px;}*/
.df_jj .ys li .fr:hover {
-webkit-animation:tada 0.5s .2s ease both;
-moz-animation:tada 0.5s .2s ease both;
}
@-webkit-keyframes tada {
0% {/*-webkit-transform:scale(1);*/ margin-right:20px;}
20% {/*-webkit-transform:scale(0.9) rotate(-3deg);*/margin-right:15px;}
40% {/*-webkit-transform:scale(1.1) rotate(3deg);*/margin-right:25px;}
60% {/*-webkit-transform:scale(1.1) rotate(-3deg);*/margin-right:15px;}
100% {/*-webkit-transform:scale(1) rotate(0);*/margin-right:20px;}
}
.df_jj .ys li .fr h1{ font-size:18px; color:#333; margin-top:5px;}
.df_jj .ys li .fr h5{ border-bottom:solid #008cd6 2px; margin:12px 0; width:40px;}
.df_jj .ys li .fr p{ text-transform:uppercase; color:#999;}

/*新闻中心*/
.df_xw{ margin:50px auto; height:460px; }
.df_xw .xw_z{ width:700px;}
.df_xw .xw_z .s{ border-bottom:dashed #004898 1px;}
.df_xw .xw_z .s li{ width:100%; height:104px; margin-bottom:20px; }
.df_xw .xw_z .s li .tu{ width:160px; height:100%;}
.df_xw .xw_z .s li .tu img{ height:100%;}
.df_xw .xw_z .s li .zi{ width:520px;}
.df_xw .xw_z .s li .zi h1{ font-size:18px; color:#004898; font-weight:normal; margin:18px 0 12px;}
.df_xw .xw_z .x{ margin-top:20px;}
.df_xw .xw_z .x li{ border-bottom:solid #f5f5f5 1px; padding:5px 0; line-height:36px; overflow:hidden;}
.df_xw .xw_z .x li a{ line-height:36px; display:block; float:left; transition:all ease 0.5s;}
.df_xw .xw_z .x li:hover a{ margin-left:30px;}
.df_xw .xw_z .x li b{ font-size:16px; color:#004898; width:30px; text-align:center; display:block; float:left;}
.df_xw .xw_z .x li span{ float:right;}
.df_xw .xw_y{ width:420px; height:455px; overflow:hidden; position:relative;}
.df_xw .xw_y img{ width:100%;}
.df_xw .xw_y .zi{ width:50%; height:100%; text-align:center; position:absolute; background:rgb(23 88 160 / 90%); top:0; left:0; color:#FFF;}
.df_xw .xw_y .zi h1{ font-size:24px; margin-top:120px; font-weight:500;}
.df_xw .xw_y .zi p{ font-size:14px; margin:15px 0 20px;}
.df_xw .xw_y .zi h5{ width:60px; height:3px; background:#FFF; margin:10px auto 50px;}
.df_xw .xw_y .zi a{ width:70%; padding:10px 0; margin:30px auto; color:#FFF; display:block; border:solid 1px #FFF; transition:0.5s all ease;}
.df_xw .xw_y .zi a:hover { background:#FFF; color:#004898;}

/* 案例*/
.anl{ width:100%; margin-top:60px; overflow:hidden; background:url(../images/anl_bg.png) repeat-x top;}
.anl .zuo{ width:270px; height:440px;  text-align:center; background:#004898; padding:30px; box-sizing:border-box; color:#FFF; position: relative; float:left;}
.anl .zuo h1{ font-size:24px; margin-top:30px; font-weight:500;}
.anl .zuo p{ font-size:14px; margin:15px 0 20px;}
.anl .zuo h5{ width:60px; height:3px; background:#FFF; margin:10px auto 50px;}
.anl .zuo a{ width:70%; padding:10px 0; margin:30px auto; color:#FFF; display:block; border:solid 1px #FFF; transition:0.5s all ease; position:absolute; bottom:30px;}
.anl .zuo a:hover { background:#FFF; color:#004898;}

#div1 {width:900px;height:360px;margin:50px auto 0; box-sizing:border-box; float: right; position:relative;/*background:#f1f1f1;*/overflow:hidden; padding:30px 30px;}
#div1 ul {position:absolute;left:0;top:0; margin:40px 0;}
#div1 ul li {float:left;width:320px;height:232px;list-style:none; padding:10px 10px;}
#div1 ul li .tu{ width:100%; border:5px solid #FFF; line-height:0; box-sizing:border-box;}
#div1 ul li .tu img { width:100%; }
#div1 ul li p{ padding:10px 0; text-align:center;}

.ys2{ margin:50px auto; overflow:hidden;}
.ys2 li{ width:224px; height:220px; text-align:center; background:#f1f1f1; float:left; margin: 0 20px 0 0; color:#4c4c4c;}
.ys2 li:nth-child(5){ margin-right: 0;}
.ys2 li .tu{ margin-top:35px;}
.ys2 li h1{ font-size:18px; margin:10px 0;}
.ys2 li p{ line-height:28px;}
.ys2 li:hover { background:#004898; color:#FFF;}